<template>
  <div class="app-container">
    <ViewSessions
      :is-order-product="isOrderProduct"
      :is-nosingle="isNosingle"
      :row-key="getRowId"
      class="sousuo"
      style="margin-bottom: 15px"
      @selected="selected"
      @add="add"
      @goback="goback"
      @single="single"
      @importFile="importFile"
      @workmanshipFile="workmanshipFile"
    />
    <el-table
      ref="multipleTable"
      border
      :row-class-name="tableRowClassName"
      :data="productList"
      :header-row-style="{
        'background-color': '#E6E6E6',
        'font-weight': 'bold',
        color: '#333',
      }"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      height="650"
      style="width: 100%; margin-bottom: 20px"
      row-key="id"
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        v-if="isOrderProduct"
        :selectable="selectable"
        :reserve-selection="true"
        type="selection"
        width="55"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="id"
        label="编号"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="picCode"
        width="150px"
        label="图号"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="picName"
        width="150px"
        label="图纸名称"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="amount"
        label="数量"
      />

      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="unitPrice"
        label="单价"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="totalPrice"
        label="总价"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="caizhi"
        label="材质"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        width="150px"
        prop="stock"
        label="原料重量合计"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="meterialPrice"
        label="材料费合计"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="workingHour"
        label="工时"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="processingChargesPrice"
        label="加工费合计"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="surfacePrice"
        label="费用"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="otherPrice"
        label="其他费用"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="companyNenifit"
        label="公司利润"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="tax"
        label="税金"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="percent"
        label="占比(%)"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="totalBenifit"
        label="利润总和"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="orderOutDate"
        label="订单交期"
      />
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="actualDate"
        label="实际交期"
      />
      <el-table-column
        v-if="isProductManager"
        align="center"
        label="派单"
      >
        <template slot-scope="scope">
          <el-button
            type="text"
            size="mini"
            @click="() => seeDispatch(scope.row)"
          >查看
          </el-button>
        </template>
      </el-table-column>
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="isAssist"
        label="是否外协"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.isAssist == 0">{{
            scope.row.isAssist == 0 ? "否" : ""
          }}</span>
          <span v-if="scope.row.isAssist == 1">{{
            scope.row.isAssist == 1 ? "是" : ""
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="状态"
        prop="statusName"
      />
      <el-table-column fixed="right" align="center" label="操作">
        <template slot-scope="scope">
          <!-- <el-button
            v-if="isNosingle &&scope.row.isAssist != 0 && scope.row.isAssist != 1"
            type="text"
            size="mini"
            @click="() => single(scope.row)"
          >是否外协
          </el-button> -->
          <el-button
            type="text"
            size="mini"
            @click="() => upload(scope.row)"
          >修改
          </el-button>
          <el-button
            type="text"
            size="mini"
            @click="() => delect(scope.row)"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :current-page="page"
      :total="total"
      :page-size="limit"
      style="padding: 30px 0; text-align: end"
      layout="total, prev, pager, next,jumper"
      @current-change="fetchData"
    />
    <el-dialog
      :visible.sync="dialogFormVisible"
      :title="dialogFormValue"
      @close="closeDialog"
    >
      <el-form
        ref="product"
        :model="product"
        :rules="validateRules"
        label-width="130px"
        style="height: 550px; overflow: auto"
      >
        <el-form-item label="订单编号：" prop="orderId">
          <el-col :span="12">
            <el-input
              :readonly="isOrderProduct"
              :disabled="readonlyInput"
              v-model="product.orderId"
              size="small"
              placeholder="请输入订单编号"
            />
          </el-col>
        </el-form-item>

        <!-- <el-form-item label="序号：" prop="indexExt">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.indexExt"
              size="small"
              placeholder="请输入序号"
            />
          </el-col>
        </el-form-item> -->
        <el-form-item label="图号：" prop="picCode">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.picCode"
              size="small"
              placeholder="请输入图号"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="图纸名称：" prop="picName">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.picName"
              size="small"
              placeholder="请输入图纸名称"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="数量：" prop="amount">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.amount"
              size="small"
              placeholder="请输入数量"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="单价：" prop="unitPrice">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.unitPrice"
              size="small"
              placeholder="请输入单价"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="总价：" prop="totalPrice">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.totalPrice"
              size="small"
              placeholder="请输入总价"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="材质：" prop="caizhi">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.caizhi"
              size="small"
              placeholder="请输入材质"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="原始重量合计：" prop="stock">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.stock"
              size="small"
              placeholder="请输入原始重量合计"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="材料费合计：" prop="meterialPrice">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.meterialPrice"
              size="small"
              placeholder="请输入材料费合计"
            />
          </el-col>
        </el-form-item>
        <el-form-item label="工时：" prop="workingHour">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.workingHour"
              size="small"
              placeholder="请输入工时"
            />
          </el-col>
        </el-form-item>
        <el-form-item
          label="加工费合计："
          prop="processingChargesPrice"
        >
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.processingChargesPrice"
              size="small"
              placeholder="请输入加工费合计"
            />
        </el-col> </el-form-item
        ><el-form-item label="费用：" prop="surfacePrice">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.surfacePrice"
              size="small"
              placeholder="请输入费用"
            />
        </el-col> </el-form-item
        ><el-form-item label="公司利润：" prop="companyBenifit">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.companyBenifit"
              size="small"
              placeholder="请输入公司利润"
            />
        </el-col> </el-form-item
        ><el-form-item label="税金：" prop="tax">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.tax"
              size="small"
              placeholder="请输入税金"
            />
        </el-col> </el-form-item
        ><el-form-item label="占比：" prop="percent">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.percent"
              size="small"
              placeholder="请输入占比"
            />
        </el-col> </el-form-item
        ><el-form-item label="利润总和：" prop="totalBenifit">
          <el-col :span="12">
            <el-input
              :disabled="readonlyInput"
              v-model="product.totalBenifit"
              size="small"
              placeholder="请输入利润总和"
            />
          </el-col>
        </el-form-item>
        <el-form-item
          v-if="isOrderProduct"
          label="订单交期："
          prop="orderOutDate"
        >
          <el-col :span="12">
            <el-date-picker
              v-model="product.orderOutDate"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="请选择订单交期"
            />
            <!-- <el-input
              :disabled="readonlyInput"
              v-model="product.orderOutDate"
              size="small"
              placeholder="请输入订单交期"
            /> -->
          </el-col>
        </el-form-item>
        <el-form-item
          v-if="isOrderProduct"
          label="实际交期："
          prop="actualDate"
        >
          <el-col :span="12">
            <el-date-picker
              v-model="product.actualDate"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="请选择实际交期"
            />
            <!-- <el-input
              :disabled="readonlyInput"
              v-model="product.actualDate"
              size="small"
              placeholder="请输入实际交期"
            /> -->
          </el-col>
        </el-form-item>
        <el-form-item
          v-if="product.id"
          label="附件："
          prop="actualDate"
        >
          <div v-for="(item, index) in imgUrlListA" :key="index">
            <a
              :href="item"
              style="
								color: #409eff;
								border-bottom: #409eff 1px solid;
							"
              target="_blank"
            >{{ item }}</a
            >
          </div>
        </el-form-item>
        <el-form-item
          v-if="product.id"
          label="工艺："
          prop="actualDate"
        >
          <div v-for="(item, index) in artFiles" :key="index">
            <a
              :href="item"
              style="
								color: #409eff;
								border-bottom: #409eff 1px solid;
							"
              target="_blank"
            >{{ item }}</a
            >
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="restData()">取 消</el-button>
        <el-button
          type="primary"
          @click="append('product')"
        >确 定</el-button
        >
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogDelect">
      <el-input
        :rows="2"
        v-model="textDelect"
        type="textarea"
        placeholder="请输入删除理由"
      />
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="delectClick">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogVueQr" width="400px">
      <div style="text-align: center; height: 220px">
        <vue-qr
          :size="191"
          :margin="0"
          :auto-color="true"
          :dot-scale="1"
          :text="appSrc"
        />
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogImg" width="700px">
      <div style="text-align: -webkit-center; height: 500px">
        <div
          v-for="(item, index) in imgUrlList"
          :key="index"
          style="width: 250px; height: 200px"
        >
          <img
            v-if="item.type == 1"
            :src="item.imgUrl"
            :class="clickIndex == index ? 'imgClick' : ''"
            style="width: 100%"
            @click="clickOpen(index)"
          >
          <div
            v-if="item.type == 2"
            style="text-align: -webkit-center; padding-top: 20px"
            @click="download(item.imgUrl)"
          >
            <div
              style="
								width: 80px;
								color: #3a8ee6;
								border-bottom: 1px #3a8ee6 solid;
							"
            >
              下载PDF
            </div>
          </div>
        </div>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogsingle">
      <el-form ref="form" :model="singleform" label-width="120px">
        <el-form-item label="是否外协：" prop="gender">
          <el-col :span="8">
            <el-select
              v-model="singleform.isoutsourcing"
              clearable
              placeholder="请选择是否外协"
              @change="changeOutsourcing"
            >
              <el-option
                v-for="item in valueList"
                :key="item.label"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-col>
        </el-form-item>
        <div v-if="singleform.isoutsourcing == 1">
          <div style="text-align: -webkit-right" @click="addList">
            <img src="../../assets/img/tj.png" >
          </div>
          <div v-for="(itrmList, index) in list" :key="index">
            <!-- <el-form-item label="选择外协人员：" prop="gender">
              <el-col :span="8">
                <el-select
                  v-model="itrmList.manufacturerUser"
                  clearable
                  placeholder="请选择外协人员"
                >
                  <el-option
                    v-for="item in listUserP"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
                <el-button
                  style="
										position: absolute;
										top: 4px;
										right: 0;
										border: #409eff 1px solid;
									"
                  plain
                  size="small"
                  @click="delectList"
                >删除</el-button>
              </el-col>
            </el-form-item> -->
            <el-form-item label="外协厂商：">
              <el-col :span="12">
                <el-select
                  v-model="itrmList.manufacturer"
                  clearable
                  placeholder="请选择外协厂商"
                >
                  <el-option
                    v-for="item in manufacturerList"
                    :key="item.manufacturer"
                    :label="item.manufacturer"
                    :value="item.manufacturer"
                  />
                </el-select>
                <el-button
                  style="
										position: absolute;
										top: 4px;
										right: 0;
										border: #409eff 1px solid;
									"
                  plain
                  size="small"
                  @click="delectList"
                >删除</el-button>
              </el-col>
            </el-form-item>
            <el-form-item label="数量：">
              <el-col :span="12">
                <el-input
                  v-model="itrmList.amount"
                  size="small"
                  placeholder="请输入数量"
                />
              </el-col>
            </el-form-item>
            <el-form-item label="计划完成时间：">
              <el-col :span="6">
                <el-date-picker
                  v-model="itrmList.manufacturerPlanTime"
                  value-format="yyyy-MM-dd"
                  type="date"
                  placeholder="计划完成时间"
                />
              </el-col>
            </el-form-item>
          </div>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          @click="outsourcingClick"
        >确 定</el-button
        >
      </div>
    </el-dialog>

    <el-dialog
      :visible.sync="dialogFileUpload.show"
      :title="isImportExecl ? '导入' : '上传压缩包'"
      width="400px"
    >
      <el-form>
        <el-form-item label="文件上传：">
          <template v-if="dialogFileUpload.fileName.length == 0">
            <el-upload
              :multiple="false"
              :http-request="httpRequest"
              :before-upload="beforeUploadFile"
              action="#"
            >
              <el-button
                size="small"
                type="primary"
              >点击上传</el-button
              >
              <div slot="tip" class="el-upload__tip">
                只能上传{{
                  isImportExecl ? "excel" : zipStr
                }}文件
              </div>
            </el-upload>
          </template>

          <div v-else class="the-file">
            {{ dialogFileUpload.fileName }}
            <el-button
              type="danger"
              size="small"
              class="the-file-delete"
              icon="el-icon-delete"
              @click="removeFile"
            />
          </div>
        </el-form-item>

        <el-form-item>
          <el-button
            :disabled="dialogFileUpload.disabled"
            :loading="dialogFileUpload.loading"
            type="primary"
            @click="confirmUpload"
          >确认上传</el-button
          >
          <el-button @click="closeUploadFileDialog">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import ViewSessions from './ViewSessions.vue'
const IMPORT_EXECL = 'IMPORT_EXECL' // 导入execl
import user from '../../api/acl/user.js'
export default {
  components: {
    ViewSessions
  },
  props: {
    installId: {
      type: String,
      default() {
        return ''
      }
    },
    orderCode: {
      type: String,
      default() {
        return ''
      }
    },
    isOrderProduct: {
      type: Boolean,
      default() {
        return false
      }
    }
  },
  data() {
    return {
      statusMap: {
        1: '未开始',
        21: '已派单',
        22: '已外协',
        23: '已派单-已外协',
        24: '供应商竣工',
        25: '已收货',
        26: '合格',
        27: '不合格',
        3: '生产中',
        4: '待品检',
        41: '报废',
        42: '可维修',
        43: '合格',
        44: '不合格',
        5: '品检中',
        51: '待入库',
        6: '入库中',
        7: '出库中',
        8: '已完成'
      },
      manufacturerList: [],
      list: [
        {
          manufacturerUser: '',
          manufacturer: '',
          amount: '',
          manufacturerPlanTime: ''
        }
      ],
      dialogsingle: false,
      listUserP: [],
      singleform: {
        insideCode: '',
        outsourcingId: '',
        isoutsourcing: '0',
        userId: ''
      },
      isOutsourcing: false,
      valueList: [
        {
          value: '0',
          label: '否'
        },
        {
          value: '1',
          label: '是'
        }
      ],
      isProductManager: window.sessionStorage.getItem('department') == 7,
      isNosingle: false,
      // isNosingle: !(window.sessionStorage.getItem('department') == 5) && !(window.sessionStorage.getItem('department') == 7) && !(window.sessionStorage.getItem('department') == 8),
      isNoOutsourcing: !(
        window.sessionStorage.getItem('department') == 5
      ),
      isRouter: !(
        window.sessionStorage.getItem('department') == 8 ||
					window.sessionStorage.getItem('department') == 10
      ),
      stpUrl: '',
      fileListStp: [],
      clickIndex: -1,
      pdfUrl: '',
      dialogImg: false,
      imgUrlList: [],
      imgUrlListA: [],
	  artFiles: [],
      dialogVueQr: false,
      appSrc: '',
      readonlyInput: false,
      imageUrl: '',
      imageUrlOne: '',
      dialogDelect: false,
      textDelect: '',
      total: 0, // 数据库中的总记录数
      page: 1, // 默认页码
      limit: 10, // 每页记录数
      ArrivalList: [
        {
          label: '0',
          value: '是'
        },
        {
          label: '1',
          value: '否'
        }
      ],
      validateRules: {
        picCode: [
          {
            required: true,
            trigger: 'change',
            message: '请输入图号'
          }
        ]
      },
      fileList: [],
      productList: [],
      dialogFormVisible: false,
      dialogFormValue: '',
      product: {
        orderId: '',
        indexExt: '',
        picCode: '',
        picName: '',
        amount: '',
        unitPrice: '',
        totalPrice: '',
        caizhi: '',
        stock: '',
        meterialPrice: '',
        workingHour: '',
        processingChargesPrice: '',
        surfacePrice: '',
        companyBenifit: '',
        tax: '',
        percent: '',
        totalBenifit: '',
        orderOutDate: '',
        actualDate: '',
        id: ''
      },
      searchInfo: {
        isComplete: '',
        productId: '',
        picCode: '',
        orderCode: '',
        picName: ''
      },
      dialogFileUpload: {
        type: IMPORT_EXECL, // upload_zip
        show: false,
        id: '',
        loading: false,
        disabled: false,
        fileName: '',
        code: '',
        formData: null,
        row: {}
      },
      excelType: ['xls', 'xlsx']
    }
  },
  computed: {
    isImportExecl() {
      return this.dialogFileUpload.type == IMPORT_EXECL
    }
  },
  // 监听上面文本框搜索
  watch: {},

  created() {},
  mounted() {
    // 是否外协
    // this.searchInfo.productId = this.$route.query.id ? this.$route.query.id : ''
    // this.searchInfo.orderCode = this.$route.query.insideCode ? this.$route.query.insideCode : ''
    this.product.orderId = this.installId
    this.searchInfo.orderCode = this.orderCode
    console.log(this.searchInfo.productId)
    this.mountedClick()
    const role = window.sessionStorage.getItem('roleName').split(',')
    for (let i = 0; i < role.length; i++) {
      if (role[i] == '是否外协') {
        this.isNosingle = true
      }
    }
    this.listDict()
    // this.listUser()
    // if (this.$route.query.id) {
    // this.listProduct()
    // } else {
    //   this.listProductForm()
    // }
  },
  methods: {
    importFile() {
      this.dialogFileUpload.show = true
      this.dialogFileUpload.disabled = false
      this.dialogFileUpload.type = IMPORT_EXECL
      this.dialogFileUpload.row = {}
    },
    workmanshipFile() {
      this.dialogFileUpload.show = true
      this.dialogFileUpload.disabled = false
      this.dialogFileUpload.type = 'zip'
      this.dialogFileUpload.row = {}
    },
    httpRequest() {},
    beforeUploadFile(file) {
      const { excelType, isImportExecl } = this
      const fileName = file.name
        .substring(file.name.lastIndexOf('.') + 1)
        .toLowerCase()

      // 验证excel类型
      if (isImportExecl) {
        if (!excelType.includes(fileName)) {
          this.$message({
            message: `上传文件只能是 ${excelType.join('、')}格式!`,
            type: 'warning'
          })
          return false
        }
      }

      const formData = new FormData()
      formData.append('file', file)
      console.log('this.dialogFileUpload.orderId: ', this.installId)
      formData.append('orderId', this.installId)

      this.dialogFileUpload.fileName = file.name
      this.dialogFileUpload.formData = formData
    },
    closeUploadFileDialog() {
      this.dialogFileUpload.fileName = ''
      this.dialogFileUpload.formData = null
      this.dialogFileUpload.show = false
      this.listProduct()
    },
    removeFile() {
      this.dialogFileUpload.fileName = ''
      this.dialogFileUpload.formData = null
    },
    confirmUpload() {
      const {
        isImportExecl,
        dialogFileUpload: { fileName, formData }
      } = this
      if (!fileName || !formData) return false

      this.dialogFileUpload.loading = true
      let uploadPromise
      if (this.dialogFileUpload.type == 'zip') {
        uploadPromise = user.uploadZip(formData)
      } else {
        uploadPromise = user.importProduct(formData)
      }

      uploadPromise.then((res) => {
        this.dialogFileUpload.loading = false
        this.dialogFileUpload.disabled = true
        this.$message.success(res.message || '导入成功')
        this.closeUploadFileDialog()
      })
    },
    listDict() {
      user.listManufacturer({
        page: 1,
        limit: 1000000
      }).then((response) => {
        this.manufacturerList = response.list
      })

      // user.listDict().then((response) => {
      // 	this.manufacturerList = response;
      // });
    },
    getRowId(row) {
      return row.id
    },
    handleSelectionChange(val) {
      console.log(val)
      this.singleform.outsourcingId = val
    },
    selectable(row, index) {
      return row.isAssist != 0 && row.isAssist != 1 // 通过某个值来进行判断，规定那一行的选择框被禁用
    },
    mountedClick() {
      this.listUser()
      this.listProduct()
    },
    goback() {
      this.$emit('goback')
    },
    addList() {
      this.list.push({
        manufacturerUser: '',
        manufacturer: '',
        amount: '',
        manufacturerPlanTime: ''
      })
    },
    single() {
      if (this.singleform.outsourcingId.length > 0) {
        this.singleform.isoutsourcing = '0'
        this.singleform.userId = ''
        this.isOutsourcing = false
        this.dialogsingle = true
        this.list = [
          {
            manufacturerUser: '',
            manufacturer: '',
            amount: '',
            manufacturerPlanTime: ''
          }
        ]
        this.listDict()
      } else {
        this.$message({
          message: '请先选择外协的产品',
          duration: 1000
        })
      }
      // this.singleform.insideCode = row.insideCode
      // this.singleform.outsourcingId = row.id
    },
    delectList(index) {
      this.list.splice(index, 1)
    },
    outsourcingClick() {
      console.log(this.singleform.isoutsourcing, this.list)
      const idList = []
      for (let i = 0; i < this.singleform.outsourcingId.length; i++) {
        idList.push(this.singleform.outsourcingId[i].id)
      }
      // return
      user.handoutProduct({
        idList: idList,
        // id: this.singleform.outsourcingId,
        productItemFullAssistList:
						this.singleform.isoutsourcing == '1' ? this.list : [],
        // productId: this.singleform.outsourcingId,
        // productCode: this.singleform.insideCode,
        isAssist: this.singleform.isoutsourcing,
        userId: this.singleform.isoutsourcing == '1' ? '' : '3',
        userType: this.singleform.isoutsourcing == '1' ? '1' : ''
      }).then((response) => {
        console.log(response)
        this.dialogsingle = false
        this.$refs.multipleTable.clearSelection()
        this.$message({
          message: '分配成功',
          duration: 1000
        })
        // if (this.$route.query.id) {
        this.listProduct()
        // } else {
        //   this.listProductForm()
        // }
      })
    },
    listUser() {
      user.listUser({
        department: '5',
        limit: 10000,
        page: 1
      }).then((response) => {
        console.log(response)
        for (let i = 0; i < response.list.length; i++) {
          const obj = {}
          if (
            response.list[i].fullName != '' &&
							response.list[i].fullName != null &&
							response.list[i].fullName != undefined
          ) {
            obj.value = response.list[i].id
            obj.label = response.list[i].fullName
            this.listUserP.push(obj)
          }
        }
      })
    },
    changeOutsourcing(val) {
      console.log(val)
      if (val == 0) {
        // 不是外协
        this.isOutsourcing = false
      } else {
        // 外协
        this.isOutsourcing = true
      }
    },
    seeOutsourcing(row) {
      this.$router.push({
        path: '/outsourcing',
        query: { productCode: row.insideCode, productId: row.id }
      })
    },
    onRemoveStp(file, fileList) {
      console.log(file, fileList)
      this.stpUrl = ''
    },
    onRemove(file, fileList) {
      console.log(file, fileList)
      this.pdfUrl = ''
    },
    /**
			 * @deprecated 下载文件
			 * @param {string} url
			 * @param {string} filename
			 */
    handleFileDownload(url, link, filename) {
      // 创建 a 标签
      const a = document.createElement('a')
      a.href = link
      a.download =
					filename +
					url.split('.')[url.split('.').length - 1] +
					'.' +
					url.split('.')[url.split('.').length - 1]
      a.click()
    },

    /**
			 * @deprecated 处理 pdf url，使其不在浏览器打开
			 * @param {string} url
			 */
    handlePdfLink(url, filename) {
      fetch(url, {
        method: 'get',
        responseType: 'arraybuffer'
      })
        .then(function(res) {
          if (res.status !== 200) {
            return res.json()
          }
          return res.arrayBuffer()
        })
        .then((blobRes) => {
          // 生成 Blob 对象，设置 type 等信息
          const e = new Blob([blobRes], {
            type: 'application/octet-stream',
            'Content-Disposition': 'attachment'
          })
          // 将 Blob 对象转为 url
          const link = window.URL.createObjectURL(e)
          this.handleFileDownload(url, link, filename)
        })
        .catch((err) => {
          console.error(err)
        })
    },
    clickOpen(val) {
      if (val == this.clickIndex) {
        this.clickIndex = -1
      } else {
        this.clickIndex = val
      }
    },
    download(val) {
      // const aLink = document.createElement('a')
      // aLink.href = val
      // aLink.click()
      window.open(val)
      // this.handlePdfLink(val, 'PDF')
    },
    listImageFolder(val) {
      user.listImageFolder({
        productId: val
      }).then((response) => {
        console.log(response)
        this.imgUrlListA = response.imageUrl
        this.artFiles = response.artFiles
        console.log(this.imgUrlListA)
        // this.imageUrl = response[0] ? response[0].imgUrl : ''
        // this.imageUrlOne = response[1] ? response[1].imgUrl : ''
        // this.pdfUrl = response[2] ? response[2].imgUrl : ''
        // this.stpUrl = response[3] ? response[3].imgUrl : ''
      })
    },
    myUploadStp(param) {
      const formData = new FormData()
      formData.append('file', param.file) // 文件（图片）

      user.objectLinkPdf(formData).then((response) => {
        this.stpUrl = response
        this.fileListStp = []
        this.fileListStp.push({
          name: param.file.name,
          url: response
        })
      })
    },
    myUploadPDF(param) {
      const formData = new FormData()
      formData.append('file', param.file) // 文件（图片）

      user.objectLinkPdf(formData).then((response) => {
        this.pdfUrl = response
        this.fileList = []
        this.fileList.push({
          name: param.file.name,
          url: response
        })
      })
    },
    removeImgOne() {
      this.imageUrlOne = ''
    },
    myUploadImgOne(param) {
      const formData = new FormData()
      formData.append('file', param.file) // 文件（图片）

      user.objectLinkPdf(formData).then((response) => {
        this.imageUrlOne = response
      })
    },
    removeImg() {
      this.imageUrl = ''
    },
    myUploadImg(param) {
      const formData = new FormData()
      formData.append('file', param.file) // 文件（图片）

      user.objectLinkPdf(formData).then((response) => {
        this.imageUrl = response
      })
    },
    addRequisition(row) {
      this.$router.push({
        path: '/requisitionList',
        query: {
          code: row.purchaseRequisition,
          productCode: row.insideCode,
          id: row.id
        }
      })
    },
    tableRowClassName({ row, rowIndex }) {
      if (row.deleteFlag == 1) {
        return 'warning-row'
      }
      return ''
    },
    delectClick() {
      if (this.textDelect == '') {
        this.$message({
          message: '请输入删除理由',
          duration: 1000
        })
        return
      }
      user.deleteProduct({
        deleteFlag: 1,
        id: this.delectId,
        deleteRemark: this.textDelect
      }).then((response) => {
        this.delectId = ''
        this.textDelect = ''
        this.dialogDelect = false
        this.$message({
          message: '删除成功',
          duration: 1000
        })
        // if (this.$route.query.id) {
        this.listProduct()
        // } else {
        //   this.listProductForm()
        // }
      })
    },
    delect(val) {
      this.delectId = val.id
      this.textDelect = ''
      this.dialogDelect = true
    },
    fetchData(val) {
      this.page = val
      // if (this.$route.query.id) {
      this.listProduct()
      // } else {
      //   this.listProductForm()
      // }
    },
    listProductForm() {
      user.listProductForm({
        insideCode: this.searchInfo.productId, // 产品编号
        status: this.searchInfo.isComplete, // 0-进行中1-已完成
        limit: this.limit,
        page: this.page
      }).then((response) => {
        console.log(response)
        this.productList = response.list
        this.total = response.total
      })
    },
    // 产品列表
    listProduct() {
      user.listProduct({
        orderId: this.installId,
        picName: this.searchInfo.picName,
        // orderCode: this.searchInfo.orderCode ? this.searchInfo.orderCode : '', // 订单编号
        picCode: this.searchInfo.picCode, //
        isAssist: this.searchInfo.isComplete, // 0-进行中1-已完成
        limit: this.limit,
        page: this.page
      }).then((response) => {
        console.log(response)
        this.total = response.total
        this.productList =
						response.list.map((item) => {
						  item.statusName =
								this.statusMap[item.status || ''] || '--'
						  return item
						}) || []
      })
    },
    insertProduct(val, val2) {
      if (val2 == 'add') {
        // 新增成功
        user.insertProduct(val)
          .then((response) => {
            // if (this.$route.query.id) {
            this.listProduct()
            // } else {
            //   this.listProductForm()
            // }
            this.$message({
              message: '新增成功',
              duration: 1000
            })
          })
          .catch((err) => {
            console.log(err)
          })
        this.dialogFormVisible = false
      } else if (val2 == 'upload') {
        user.updateProduct(val)
          .then((response) => {
            // if (this.$route.query.id) {
            this.listProduct()
            // } else {
            //   this.listProductForm()
            // }
            this.$message({
              message: '修改成功',
              duration: 1000
            })
          })
          .catch((err) => {
            console.log(err)
          })
        // 修改成功
        this.dialogFormVisible = false
      }
    },
    closeDialog() {
      this.product = {
        indexExt: '',
        picCode: '',
        picName: '',
        amount: '',
        unitPrice: '',
        totalPrice: '',
        caizhi: '',
        stock: '',
        meterialPrice: '',
        workingHour: '',
        processingChargesPrice: '',
        surfacePrice: '',
        companyBenifit: '',
        tax: '',
        percent: '',
        totalBenifit: '',
        orderOutDate: '',
        actualDate: '',
        id: ''
      }
      this.imageUrl = ''
      this.imageUrlOne = ''
      this.pdfUrl = ''
      this.stpUrl = ''
      this.fileList = []
      this.fileListStp = []
      this.$refs.product.resetFields()
    },
    append(val) {
      this.$refs[val].validate((valid) => {
        if (valid) {
          if (
            this.product.id == '' ||
							this.product.id == null ||
							this.product.id == undefined
          ) {
            this.insertProduct(
              {
                orderId: this.product.orderId,
                indexExt: this.product.indexExt,
                picCode: this.product.picCode,
                picName: this.product.picName,
                amount: this.product.amount,
                unitPrice: this.product.unitPrice,
                totalPrice: this.product.totalPrice,
                caizhi: this.product.caizhi,
                stock: this.product.stock,
                meterialPrice: this.product.meterialPrice,
                workingHour: this.product.workingHour,
                processingChargesPrice:
										this.product.processingChargesPrice,
                surfacePrice: this.product.surfacePrice,
                companyBenifit: this.product.companyBenifit,
                tax: this.product.tax,
                percent: this.product.percent,
                totalBenifit: this.product.totalBenifit,
                orderOutDate: this.product.orderOutDate,
                actualDate: this.product.actualDate
              },
              'add'
            )
          } else {
            this.insertProduct(
              {
                orderId: this.product.orderId,
                indexExt: this.product.indexExt,
                picCode: this.product.picCode,
                picName: this.product.picName,
                amount: this.product.amount,
                unitPrice: this.product.unitPrice,
                totalPrice: this.product.totalPrice,
                caizhi: this.product.caizhi,
                stock: this.product.stock,
                meterialPrice: this.product.meterialPrice,
                workingHour: this.product.workingHour,
                processingChargesPrice:
										this.product.processingChargesPrice,
                surfacePrice: this.product.surfacePrice,
                companyBenifit: this.product.companyBenifit,
                tax: this.product.tax,
                percent: this.product.percent,
                totalBenifit: this.product.totalBenifit,
                orderOutDate: this.product.orderOutDate,
                actualDate: this.product.actualDate,
                id: this.product.id
              },
              'upload'
            )
          }
        }
      })
    },
    restData() {
      this.dialogFormVisible = false
      this.dialogFormValue = ''
    },
    selected(val) {
      this.searchInfo = val
      this.page = 1
      // if (this.$route.query.id) {
      this.listProduct()
      // } else {
      //   this.listProductForm()
      // }
    },
    add() {
      this.dialogFormVisible = true
      this.readonlyInput = false
      this.fileList = []
      this.dialogFormValue = '新增产品'
      if (this.isOrderProduct) {
        this.product.orderId = this.installId
      }
    },
    seeVueQr(val) {
      this.dialogVueQr = true
      this.appSrc = val.insideCode + ''
    },
    seeOrder(val) {
      user.listImageFolder({
        productId: val.id
      }).then((response) => {
        console.log(response)
        if (response.length > 0) {
          this.dialogImg = true
          this.imgUrlList = response
        } else {
          this.$message({
            message: '暂无可以查看的文件',
            duration: 1000
          })
        }
      })
    },
    seeDispatch(val) {
      this.$router.push({ path: '/dispatchList', query: { id: val.id }})
    },
    seeDeleteItem(val) {
      this.dialogFormVisible = true
      this.dialogFormValue = '查看产品'
      this.readonlyInput = true
      this.listImageFolder(val.id)
      this.product = {
        orderId: val.orderId,
        indexExt: val.indexExt,
        picCode: val.picCode,
        picName: val.picName,
        amount: val.amount,
        unitPrice: val.unitPrice,
        totalPrice: val.totalPrice,
        caizhi: val.caizhi,
        stock: val.stock,
        meterialPrice: val.meterialPrice,
        workingHour: val.workingHour,
        processingChargesPrice: val.processingChargesPrice,
        surfacePrice: val.surfacePrice,
        companyBenifit: val.companyBenifit,
        tax: val.tax,
        percent: val.percent,
        totalBenifit: val.totalBenifit,
        orderOutDate: val.orderOutDate,
        actualDate: val.actualDate,
        id: val.id
        // isArrival:'',
      }
    },
    upload(val) {
      this.dialogFormVisible = true
      this.readonlyInput = false
      this.dialogFormValue = '修改产品'
      this.listImageFolder(val.id)
      this.product = {
        orderId: val.orderId,
        indexExt: val.indexExt,
        picCode: val.picCode,
        picName: val.picName,
        amount: val.amount,
        unitPrice: val.unitPrice,
        totalPrice: val.totalPrice,
        caizhi: val.caizhi,
        stock: val.stock,
        meterialPrice: val.meterialPrice,
        workingHour: val.workingHour,
        processingChargesPrice: val.processingChargesPrice,
        surfacePrice: val.surfacePrice,
        companyBenifit: val.companyBenifit,
        tax: val.tax,
        percent: val.percent,
        totalBenifit: val.totalBenifit,
        orderOutDate: val.orderOutDate,
        actualDate: val.actualDate,
        id: val.id
        // isArrival:'',
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.avatar-uploader .el-upload {
	border: 1px dashed #d9d9d9;
	border-radius: 6px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
}
.avatar-uploader .el-upload:hover {
	border-color: #409eff;
}
.avatar-uploader-icon {
	font-size: 28px;
	color: #8c939d;
	width: 178px;
	height: 178px;
	line-height: 178px;
	text-align: center;
	border: 1px #dcdfe6 solid;
}
.avatar {
	width: 178px;
	height: 178px;
	display: block;
}
.el-table .warning-row {
	background: #ff02027a;
}
// img{
//         width: 700px;
//         overflow: hidden;
//         margin: 0 auto;
//     }
#img img {
	width: 100%;
	transition: all 2s; /*图片放大过程的时间*/
	position: relative;
}
.imgClick {
	cursor: crosshair;
	transform: scale(3); /*以y轴为中心旋转*/
}

div {
	b {
		display: block;
		position: absolute;
		left: 176px;
		top: -10px;
		width: 18px;
		height: 18px;
		border-radius: 100%;
		background: #fff;
		color: #333;
		text-align: center;
		line-height: 16px;
		font-size: 18px;
		z-index: 10;
		border: 1px solid #93a9ca;
		cursor: pointer;
	}
}
//      .imageUrlOne {
//        b{
//           display: block;
//     position: absolute;
// left: 176px;
//     top: -10px;
//     width: 18px;
//     height: 18px;
//     border-radius: 100%;
//     background: #fff;
//     color: #333;
//     text-align: center;
//     line-height: 16px;
//     font-size: 18px;
//     z-index: 10;
//     border: 1px solid #93a9ca;
//     cursor: pointer;
//     }
//      }
</style>
